<?php
/**
 * @link https://www.kancloud.cn/cleverstone/ymb2
 * @copyright Copyright (c) 2020 Yii Manager Software LLC
 */

namespace builder\widget\ajax;

use builder\widget\BaseWidget;

/**
 * layui时间线
 * ```php
 * Timeline::widget([
 *  'data' => [
 *      ['icon' => 'bi bi-apple', 'title' => '有何不可', 'content' => '天空好像下雨，我好想住在你家隔壁。'],
 *      ['icon' => 'bi bi-apple', 'title' => '有何不可', 'content' => '天空好像下雨，我好想住在你家隔壁。'],
 *      ['icon' => 'bi bi-apple', 'title' => '有何不可', 'content' => '天空好像下雨，我好想住在你家隔壁。'],
 *  ],
 *  'options' => [
 *      'root' => [
 *          'class' => ['p-5'],
 *          'style' => ['color' => 'red'],
 *          'attribute' => ['data-test' => 1],
 *       ],
 *      'icon' => [
 *          'class' => 'p-5',
 *          'style' => 'color:blue',
 *          'attribute' => 'data-test=2',
 *      ],
 *      'title' => [
 *          'class' => 'p-5',
 *          'style' => 'color:blue',
 *          'attribute' => 'data-test=3',
 *      ],
 *      'content' => [
 *          'class' => 'p-5',
 *          'style' => 'color:blue',
 *          'attribute' => 'data-test=4',
 *      ],
 *  ],
 * ]);
 * ```
 * @see https://layui.dev/docs/2/timeline/#examples
 */
class Timeline extends BaseWidget
{
    /**
     * @var array 布局选项
     * - root [attribute][class][style] 根元素选项
     * - icon [attribute][class][style] 图标元素选项
     * - title [attribute][class][style] 标题元素选项
     * - content [attribute][class][style] 内容元素选项
     */
    public array $options;
    /**
     * @var array 时间线节点数据集合
     * - [icon] string 时间线节点图标
     * - [title] string|null 时间线节点标题
     * - [content] string|null 时间线节点内容
     */
    public array $data = [];

    /**
     * @return void
     */
    public function init()
    {
        parent::init();

        $this->initOptions();
    }

    /**
     * @return void
     */
    protected function initOptions(): void
    {
        $options = $this->options;
        if (!empty($options['root'])) {
            $root = array_merge($this->defaultOption(), $options['root']);
            $this->formatStyle($root['style']);
            $this->formatUiClass($root['class']);
            $this->formatHtmlAttribute($root['attribute']);
            $options['root'] = $root;
        } else {
            $options['root'] = $this->defaultOption();
        }

        if (!empty($options['icon'])) {
            $icon = array_merge($this->defaultOption(), $options['icon']);
            $this->formatStyle($icon['style']);
            $this->formatUiClass($icon['class']);
            $this->formatHtmlAttribute($icon['attribute']);
            $options['icon'] = $icon;
        } else {
            $options['icon'] = $this->defaultOption();
        }

        if (!empty($options['title'])) {
            $title = array_merge($this->defaultOption(), $options['title']);
            $this->formatStyle($title['style']);
            $this->formatUiClass($title['class']);
            $this->formatHtmlAttribute($title['attribute']);
            $options['title'] = $title;
        } else {
            $options['title'] = $this->defaultOption();
        }

        if (!empty($options['content'])) {
            $content = array_merge($this->defaultOption(), $options['content']);
            $this->formatStyle($content['style']);
            $this->formatUiClass($content['class']);
            $this->formatHtmlAttribute($content['attribute']);
            $options['content'] = $content;
        } else {
            $options['content'] = $this->defaultOption();
        }

        $this->options = $options;
    }

    /**
     * @return string[]
     */
    protected function defaultOption(): array
    {
        return ['class' => '', 'style' => '', 'attribute' => ''];
    }

    /**
     * @return string
     */
    public function run(): string
    {
        return $this->render('timeline', [
            'data' => $this->data,
            'options' => $this->options,
        ]);
    }
}